/* https://www.antdv.com/components/modal-cn#api */
import type { ButtonProps } from 'ant-design-vue'
import type { Component, VNode } from 'vue'

export type DialogProps = {
  /** 标题 */
  title?: string
  /** 宽度 */
  width?: number | string
  /** 是否展示遮罩 */
  open?: boolean
  /* Modal 完全关闭后的回调 */
  afterClose?: Function
  /* Modal body 样式 */
  bodyStyle?: object
  /* cancel 按钮 props */
  cancelButtonProps?: ButtonProps
  /* 取消按钮文字 */
  cancelText?: string
  /* 垂直居中展示 Modal */
  centered?: boolean
  /* 是否全屏（设置全屏 width、wrapClassName 设置的值无效） */
  fullScreen?: boolean
  /** 是否展示关闭按钮 */
  closable?: boolean
  /* 	自定义关闭图标 */
  closeIcon?: VNode
  /* 确定按钮 loading */
  confirmLoading?: boolean
  /* 关闭时销毁 Modal 里的子元素 */
  destroyOnClose?: boolean
  /* 底部内容 */
  footer?: string | false
  /* 是否显示底部内容 */
  showFooter?: boolean
  /* 强制渲染 Modal */
  forceRender?: boolean
  /* 是否支持键盘 esc 关闭 */
  keyboard?: boolean
  /** 是否显示遮罩层 */
  mask?: boolean
  /** 是否允许点击遮罩层关闭 Dialog */
  maskClosable?: boolean
  /* 遮罩样式 */
  maskStyle?: object
  /* 	ok 按钮 props */
  okButtonProps?: ButtonProps
  /* 	确认按钮文字 */
  okText?: string
  /* 	确认按钮类型 */
  okType?: string
  /* 对话框外层容器的类名 */
  wrapClassName?: string
}

export type DialogOptions = DialogProps & {
  /** 自定义内容渲染器 */
  contentRenderer?: () => VNode | Component
  /* 自定义底部渲染器 */
  footerRenderer?: () =>
    | VNode
    | Component /** 点击底部确定按钮的回调，会暂停 `Dialog` 的关闭. 回调函数内执行 `done` 参数方法的时候才是真正关闭对话框的时候 */
  beforeSure?: (
    done: Function,
    {
      options,
      index
    }: {
      options: DialogOptions
      index: number
    }
  ) => void
}
